<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4"
      xmlns:sec="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <div id="questionFunc">
        <script>
            var areas = ['','choiceArea','blankArea','judgeArea','shortArea'];
            function showArea( index ){
                for(var i=1; i<=4; i++){
                    $("#e_"+ areas[i] ).hide();
                }
                $("#e_"+ areas[index] ).show();
            }

            //下拉切换题型, 如本来选择修改的题目名称是选择题,
            //我在题目类型下拉框切换成判断题, 那展示的内容页随之切换
            function editChangeType(){
                var typeId = $("#e_typeId").val();
                showArea( parseInt( typeId ) );
            }

            function loadQuestion( queId ) {
                getJSON( {
                    url: ctxPath +"/Question/queryQuestionById/"+ queId,
                    success:function( resp ){
                        var QUE = resp.data;
                        $("#e_questionTitle").val( QUE.questionTitle );
                        $("#e_score").val( QUE.score );
                        $("#e_id").val( QUE.id );    //question.id

                        var q_typeId = QUE.typeId;
                        $("#e_typeId").val( q_typeId );

                        //问题类型 ID ~ 1:选择  2:填空  3:判断  4:简答
                        if(q_typeId == '1'){
                            //选择题区域 ABCD 具体内容
                            $("#e_optionA").val(QUE.questionOptions.optionA);
                            $("#e_optionB").val(QUE.questionOptions.optionB);
                            $("#e_optionC").val(QUE.questionOptions.optionC);
                            $("#e_optionD").val(QUE.questionOptions.optionD);
                            $("#e_choiceAnswer").val( QUE.questionAnswer );
                        }
                        if(q_typeId == '2'){   //2:填空题
                            $("#e_blankAnswer").val( QUE.questionAnswer );
                        }
                        if(q_typeId == '3'){   //3:判断题  0: 错误, 1: 正确
                            if( QUE.questionAnswer=="1" ){
                                $("#trueOption").prop("checked",true)
                            }else{
                                $("#falseOption").prop("checked",true)
                            }
                        }
                        showArea( q_typeId );
                    }
                } );
            }
            function gotoIndex(){
                window.location = ctxPath +"/Question/index";
            }

            function getFormData( formId ){ //questionForm
                //1.获取表单里面参数
                var form = $("#"+ formId).serializeObject();
                if( form.typeId=='1' ){
                    //1-选择题
                    form.questionOptions = {
                        optionA: form.optionA,
                        optionB: form.optionB,
                        optionC: form.optionC,
                        optionD: form.optionD,
                        /* questionId: form.id */
                    }
                    form.questionAnswer = form.choiceAnswer;
                }else if( form.typeId=='2' ){  //2-填空题
                    form.questionAnswer = form.blankAnswer;
                }else if( form.typeId=='3' ){  //3-判断题
                    form.questionAnswer = form.judgeAnswer;
                }
                console.log( "+-----------------序列化对象------------------+" );
                console.log( form );
                console.log( JSON.stringify( form ) );
                console.log( "+---------------------------------------------+" );
                return form;
            }
            function rescRESP( data, OP ) {  //OP: 更新 | 新增
                var ret = data.result;
                if(ret=='success'){
                    confirmSEL(
                        OP +"题目成功。",
                        gotoIndex );
                }else{
                    confirmFail(OP +"题目失败, 原因:"+ data.cause);
                }
            }
        </script>
    </div>

</body>
</html>
